<template>
  <div>
    <section class="demo-text">
        <el-row>
            <el-col :span="8">
<tree :data="alltree" :setting="setting"></tree>
            </el-col>
                   <el-col :span="8">
                <tree :data="alltree" :setting="setting"></tree>
            </el-col>
                   <el-col :span="8">
                <tree :data="alltree" :setting="setting"></tree>
            </el-col>
        </el-row>
      
    </section>
    <p
      style="text-align:right;padding-right:60px;    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 9999;
    pointer-events: none;"
    >@王睿杰 2019.7.24</p>
  </div>
</template>
<script>
import {diyu,xmb} from "./coudata"
import tree from "../Demos/tree";
function digui(list,tree,alllist,alltree,allxmb){
    if(tree){
      tree.children =list;  
    }  
    if(alltree.length==0){
        list= alllist.filter(ele=>{
            return ele.parentid==0
        })
        alltree.push(...list)        
    }
    list.forEach(item=>{
        let childrenlist = allxmb.filter(ele=>{
            return ele.suoshuxiangmubu==item.id||ele.suoshudiyu==item.id
        })
            return digui(childrenlist,item,allxmb,alltree,alllist)
        })
}
function digui1(list,tree,alllist,alltree){
    if(tree){
      tree.children =list;  
    }  
    if(alltree.length==0){
        list= alllist.filter(ele=>{
            return ele.parentid==0
        })
        alltree.push(...list)        
    }
    list.forEach(item=>{
        let childrenlist = alllist.filter(ele=>{
            return ele.suoshuxiangmubu==item.id||ele.suoshudiyu==item.id
        })
            return digui(childrenlist,item,alllist,alltree)
        })
}
export default {
  components: { tree },
  data() {
    return {
      data: [
        {
          label: "1",
          children: [
            {
              label: "2"
            },
            {
              label: "4"
            }
          ]
        }
      ],
      setting: {
        name: "name",
                    children:'children',
            checked:"checked"
      },
      dylist:[],
      xmblist:[],
    };
  },
  computed:{
      alltree(){
          const list = [];
        digui(null,null,this.dylist,list,this.xmblist);
        return list;  
      },
      citytree(){
                    const list = [];
        digui(null,null,this.dylist,list) ;
        return list;  
      },
      xmbtree(){
         const list = [];
        digui(null,null,this.xmblist,list) ;
        return list;  
      }
  },
  methods:{
    getdylist(){
                          this
        .$axios({
          method: "post",
          url: "http://192.168.31.16:8080/diyu/selectAll",
        })
        .then(response => {
            console.log(response);
            let data = response.data;
            data.map(item=>{
                item.name =item.diyumingcheng
                return item
            })

            this.dylist = data;
        })
        .catch(error => {
              let data = diyu;
            data.map(item=>{
                item.name =item.diyumingcheng
                return item
            })
            this.dylist = data;
          console.log(error);
        });
        },
        getxmblist(){
                                  this
        .$axios({
          method: "post",
          url: "http://192.168.31.16:8080/xmb/selectAll",
        })
        .then(response => {
            console.log(response);
            let data =  response.data;
                data.map(item=>{
                item.name =item.xmbname
                return item
            })
            this.xmblist = data;
        })
        .catch(error => {
          let data =  xmb
                data.map(item=>{
                item.name =item.xmbname
                return item
            })
            this.xmblist = data;
          console.log(error);
        });
        }
  },
mounted (){
    this.getdylist();
    this.getxmblist()
}
};
</script>

